<template>
	<page-card title="请假审批详情">
		<div class="table-page-search-wrapper">
			<a-row type="flex"
						 justify="center">
				<a-col style="font-size:18px;font-weight:800;margin:20px;">
					重庆市公安局党委成员外出请假审批表
				</a-col>
			</a-row>
			<a-row type="flex"
						 justify="center">
				<a-col :span="3"
							 class="front">
					姓名
				</a-col>
				<a-col :span="3"
							 class="value">
					name
				</a-col>
				<a-col :span="2"
							 class="front">
					性别
				</a-col>
				<a-col :span="2"
							 class="value">
					gender
				</a-col>
				<a-col :span="2"
							 class="front">
					年龄
				</a-col>
				<a-col :span="3"
							 class="value">
					age
				</a-col>
			</a-row>
			<a-row type="flex"
						 justify="center">
				<a-col :span="3"
							 class="front">
					职务
				</a-col>
				<a-col :span="5"
							 class="value">
					post
				</a-col>
				<a-col :span="2"
							 class="front">
					起止时间
				</a-col>
				<a-col :span="5"
							 class="value">
					time
				</a-col>
			</a-row>
			<a-row type="flex"
						 justify="center">
				<a-col :span="3"
							 class="front"
							 style="height:60px;">
					事由
				</a-col>
				<a-col :span="12"
							 class="value"
							 style="height:60px;">
					reason
				</a-col>
			</a-row>
			<a-row type="flex"
						 justify="center">
				<a-col :span="15"
							 style="border:1px solid #aaa;display: flex;justify-content: center;align-items: center;">
					<a-col :span="12"
								 style="margin-bottom:20px">
						<a-col style="color:#0670d1;margin:20px 0;font-size:20px">办理流程</a-col>
						<a-timeline>
							<a-timeline-item>
								<a-icon slot="dot"
												type="check-circle"
												style="font-size: 16px;" />
								<a-row type="flex"
											 justify="space-between">
									<a-col>发起申请</a-col>
									<a-col style="color:#c2c2c2">2021-12-26 20:00</a-col>
								</a-row>
								<a-col style="color:#c2c2c2">我</a-col>
							</a-timeline-item>
							<a-timeline-item>
								<a-icon slot="dot"
												type="check-circle"
												style="font-size: 16px;" />
								<a-row type="flex"
											 justify="space-between">
									<a-col>
										<a-row type="flex">
											<a-col>某某某</a-col>
											<a-col style="color:#0670d1;margin-left:5px">已同意</a-col>
										</a-row>
									</a-col>
									<a-col style="color:#c2c2c2">2021-12-26 20:00</a-col>
								</a-row>
								<a-col style="color:#c2c2c2">拟同意</a-col>
								<a-col>签名：</a-col>
							</a-timeline-item>
							<a-timeline-item>
								<a-icon slot="dot"
												type="check-circle"
												style="font-size: 16px;" />
								<a-row type="flex"
											 justify="space-between">
									<a-col>
										<a-row type="flex">
											<a-col>某某某</a-col>
											<a-col style="color:#ec5555;margin-left:5px">审核中</a-col>
										</a-row>
									</a-col>
									<a-col style="color:#c2c2c2">2021-12-26 20:00</a-col>
								</a-row>
							</a-timeline-item>
						</a-timeline>
					</a-col>

				</a-col>
			</a-row>
			<a-row type="flex"
						 justify="center"
						 style="margin:20px;">
				<a-button type="primary"
									style="margin-right:80px;">
					打印
				</a-button>
				<a-button type="primary">
					返回
				</a-button>
			</a-row>
		</div>
	</page-card>
</template>
<script>
import { leaveInfoList, leaveInfoDel } from '@/api/leaveinfo'
import { Timeline } from 'ant-design-vue'
import {
	PAGINATION,
	TABLE_STATUS_CELL
} from '@zt/zongheng-pro/framework/constants'
export default {
	name: 'test',
	components: { [Timeline.Item.name]: Timeline.Item }
}
</script>
<style>
.front {
	height: 40px;
	display: flex;
	justify-content: center;
	align-items: center;
	border: 1px solid #aaa;
}
.value {
	display: flex;
	align-items: center;
	padding-left: 10px;
	border: 1px solid #aaa;
	height: 40px;
}
</style>